<template>
	<view>
		<uNavbar title="实名认证" ></uNavbar>
		<view class="bg2 flex_c">
			<image src="../../static/image/bg2.png" mode=""></image>
		</view>
		<view class="bg9 flex_ZC">
			<view class="security flex_c">
				<image src="../../static/icon/i_qa.png" mode=""></image>
				<text class="c5">信息安全保障中</text>
			</view>
			<view class="information flex_Z">
				<text class="c3">请输入您的实名信息</text>
				<view class="information_box flex_Z">
					<text>姓名</text>
					<input type="text"  placeholder="请输入本人姓名" v-model.trim="name"/>
				</view>
				<view class="information_box flex_Z">
					<text>手机号</text>
					<input type="text"  placeholder="请输入本人实名下的手机号" v-model.trim="phone"/>
				</view>
				<view class="information_box flex_Z">
					<text>身份证号 </text>
					<input type="text"  maxlength="18"  placeholder="请输入本人身份证号"  v-model.trim="idCard"  @confirm="isRealName"/>
				</view>
			</view>
		</view>
		<view class="provide flex_c">
			<text >国家政策规定，数藏仅支持年满18周岁至65周岁中国大陆用户购买，认证信息将作为开户信息使用，一经认证不允许修改。</text>
		</view>
		<view class="log_out flex_c" :class="check?'bgTaggle':''" @click="isRealName">
			<image class="highlights" v-if="check" src="../../static/image/mask.png" mode=""></image>
			<text>确认</text>
		</view>
<!-- 		<view class="next_step flex_c" :class="check?'bgTaggle':''" @click="isRealName">
			<image class="highlights" v-if="check" src="../../static/image/mask.png" mode=""></image>
			<text>确认</text>
		</view> -->
	</view>
</template>

<script>
	import {submitrealname} from "../../api/setting.js";
	export default {
		data() {
			return {
				name: '', //账号
				phone:'',//手机号
				idCard: '', //密码
				check: false, //监听用户是否输入内容
			}
		},
		onLoad() {
		
		},
		// 监听事件
		watch: {
			idCard(val) {
				if (uni.$u.test.idCard(this.idCard)) {
					this.check = true
				} else {
					this.check = false
				}
			}
		},
		methods: {

			// 实名认证
			isRealName(){
				let that = this;
				let {name,idCard,phone} = that;
				if (uni.$u.test.isEmpty(name)) {
					uni.$u.toast('请输入您的姓名');
					return;
				}
				if (!uni.$u.test.mobile(phone)) {
					uni.$u.toast('请输入手机号');
					return;
				}
				if (!uni.$u.test.idCard(idCard)) {
					uni.$u.toast('身份证号不正确');
					return;
				}
				let data = {
					phone:that.phone,
					real_name:that.name,
					id_num:that.idCard,
				}
				submitrealname(data).then(res=>{
					console.log(res)
					if(res.code==1){
						uni.setStorageSync("realName",1)
						uni.$u.toast(res.msg);
						setTimeout(function() {
							
							uni.navigateBack({
								delta:1
							})
						}, 1500);
					}else{
						uni.$u.toast(res.msg);
					}
				})
			},
		},
	}
</script>

<style scoped>

	.bg2{
		width: 100%;
		height:316rpx;
	}
	.bg2>image{
		width:250rpx;
		height:100%;
	}
	.bg9{
		width:690rpx;
		min-height:710rpx;
		margin: 0 auto;
		background: url('../../static/image/bg9.png');
		background-size: 100% 100%;
		padding-bottom: 100rpx;
	}
	.security{
		width: 100%;
		margin: 30rpx 0;
	}
	.security>image{
		width: 62rpx;
		height: 62rpx;
	}
	.security>text{
		font-size: 36rpx;
		margin-left: 22rpx;
	}
	.information{
		width: 594rpx;
		min-height: 542rpx;
		border: 2rpx solid rgba(130,121,227,0.1);
		border-radius: 10rpx;
		font-size: 32rpx;
		padding-bottom: 30rpx;
	}
	.information>text{
		margin: 50rpx 40rpx 40rpx;
	}
	.information_box{
		width: 88%;
		margin: 20rpx auto;
		color: #333333;
	}
	.information_box>input{
		margin-top: 40rpx;
		padding-bottom: 10rpx;
		color: #808080;
		border-bottom: 1rpx solid #D7BA93;
	}
	.provide{
		width: 600rpx;
		font-size: 24rpx;
		color: #A7A4AD;
		margin: 60rpx auto;
	}
	.log_out {
		position: relative;
		width: 92%;
		margin: 50rpx auto 0;
	}

	.log_out>text {
		text-align: center;
		width: 100%;
		background: linear-gradient(274deg, #ab9880 , #d7c4aa ); 
		color: #ffffff90;
		font-size: 32rpx;
		padding: 20rpx 0;
		border-radius: 40rpx;
	}

	.bgTaggle>text {
		width: 100%;
		text-align: center;
		font-size: 32rpx;
		padding: 20rpx 0;
		border-radius: 40rpx;
		color: #ffffff !important;
		background: linear-gradient(274deg, #AB8E68, #D7BA93) !important;
	}
</style>